<template>
    <div class="plan-book-edit-view">

      <el-dialog
        v-if="dialogVisible"
        title="提交方案书"
        :visible.sync="dialogVisible"
        width="750px"
        :before-close="handleClose">
        <div>

          <el-form :inline="true" ref="form" :model="form" :rules="rules" label-width="150px">

            <el-row>

              <el-col :span="24">
                <el-form-item label="项目名称">
                  <div>{{project.project_name}}</div>
                </el-form-item>
              </el-col>

              <el-col :span="12">
                <el-form-item label="项目技术方案书" prop="tech">
                  <upload ref="upload" :limit="1" :tipShow="false" :edit-list="form.tech" @uploadSuccess="uploadSuccess" @deleteSuccess="deleteSuccess"/>
                </el-form-item>
              </el-col>

              <el-col :span="12">
                <el-form-item label="项目预算方案书" prop="budget">
                  <upload ref="upload1" :limit="1" :tipShow="false" :edit-list="form.budget" @uploadSuccess="uploadSuccess1" @deleteSuccess="deleteSuccess1" />
                </el-form-item>
              </el-col>

              <el-col :span="24">
                <el-form-item label="其他">
                  <upload ref="upload2" :edit-list="form.other" @uploadSuccess="uploadSuccess2" @deleteSuccess="deleteSuccess2" />
                </el-form-item>
              </el-col>

            </el-row>








          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="confirmClick">确 定</el-button>
        </span>
      </el-dialog>

    </div>
</template>

<script>
    export default {
        name: "planBookEditView",
        data:function () {
            return{
                limit:1,
                dialogVisible:false,
                datas:{},
                list:[],
                form:{
                    tech:[],
                    budget:[],
                    other:[],
                },
                rules: {
                    tech: [
                        { required: true, message: '请上传项目技术方案书' },
                    ],
                    budget: [
                        { required: true, message: '请上传项目预算方案书' },
                    ]
                },
                project:{},
            }
        },
        methods:{
            handleClose:function () {
                this.dialogVisible = false;
            },
            confirmClick:function () {

                this.$refs.form.validate((value)=>{
                    if (value) {
                        console.log('sucess')

                        this.form.tech.forEach(item=>{item.model_id = this.project.id;item.model_no = this.project.project_no;item.project_id = this.project.id;item.project_name = this.project.project_name;})
                        this.form.budget.forEach(item=>{item.model_id = this.project.id;item.model_no = this.project.project_no;item.project_id = this.project.id;item.project_name = this.project.project_name;})
                        this.form.other.forEach(item=>{item.model_id = this.project.id;item.model_no = this.project.project_no;item.project_id = this.project.id;item.project_name = this.project.project_name;})

                        this.dialogVisible = false;
                        this.$emit("confirmDataBack",this.form)
                    } else {

                        return;
                    }
                })

            },
            openDialog:function (data) {
                this.project = data;
                this.form = {
                    tech:[],
                    budget:[],
                    other:[],
                }
                this.list = []
                this.dialogVisible = true;
            },
            deleteSuccess() {
                this.form.tech = this.$refs.upload.emitFileList()

                this.$refs.form.validateField('tech', emailError => {

                });

            },
            uploadSuccess() {
                this.form.tech = this.$refs.upload.emitFileList()

                this.$refs.form.validateField('tech', emailError => {

                });
            },
            deleteSuccess1() {
                this.form.budget = this.$refs.upload1.emitFileList()

                this.$refs.form.validateField('budget', emailError => {

                });
            },
            uploadSuccess1() {
                this.form.budget = this.$refs.upload1.emitFileList()

                this.$refs.form.validateField('budget', emailError => {

                });
            },
            deleteSuccess2() {
                this.form.other = this.$refs.upload2.emitFileList()
            },
            uploadSuccess2() {
                this.form.other = this.$refs.upload2.emitFileList()
            },
        }
    }
</script>

<style lang="scss">

</style>
